- 综合排序
- 最热优先
- 最新优先
- 来自专栏前端博客
vitepress搭建markdown文档博客
基于 Vite 而不是 Webpack 所以更快的启动时间，热重载等使用 Vue3 来减少 JS 的有效负载vuePress=webpack+vue2,vitePress=vite+vue3html目前主流搭建文档站点的方式 （React）VuePress - 包含由 Vue 驱动的主题系统和插件 API，另一个部分是为书写技术文档而优化的默认主题（Vue）VitePress - 对 VuePress 进行了不少的改进。 vite-plugin-mdx Vite 支持 MDX 的插件vite-plugin-react-pages 文档插件核心实现vite-pages-theme-doc 官方的文档主题。 依赖 react-router-dom ^5.0.0 版本pages 目录为文档入口。 VitePress 学习(全面拥抱vite)---翻译 https://juejin.cn/post/6965510644007665671转载本站文章《vitepress搭建markdown文档博客
2.8K20编辑于 2023-06-06 - 来自专栏大前端全栈开发
用vitepress搭建文档网站踩坑记录
之前用 vuepress2 + vite 成功搭建了一个博客网站，这不 vue3 的文档改用 vitepress 搭建的，看着挺好看的，就想着也来折腾折腾搭建一个工作的文档网站。 homepage 主页设置vuepress 或者网上 vitepress 的一些教程都写的设置 home: true，就可以设置成主页，试了好久没效果，最后看文档人家的是要设置 layout: home 才行，一试文档诚不骗我，perfect！ 这一点 vitepress 官方文档里的版本迁移 Migration from VitePress 0.x 里其实已经有说明。 ./.vitepress/dist。
61320编辑于 2023-11-16 - 来自专栏后段开发
腾讯云部署vitepress，高颜值文档博客
https://vitepress.dev/先看两张效果图。图片图片一定要用这个官网，之前看了一个翻译版本，好像翻了一半不弄了，坑了半天时间也解决不了。目前看起来还没有官翻。 安装node这个教程比较多了，就不再细说了安装vitepress依赖mkdir viteblog // 新建博客目录npm init // 新建node环境npm install -D vitepress // 安装vitepressnpx vitepress init // 安装向导本教程使用的配置如下：图片默认的文档及编译后静态文件产出都存放到 docs 下边。 /docs/.vitepress/dist以下是一个当前使用中的例子，有兴趣可以看一下。https://www.xyccstudio.cn/books/
1.4K20编辑于 2023-07-07 - 来自专栏大前端全栈开发
用vitepress搭建文档网站踩坑记录
之前用 vuepress2 + vite 成功搭建了一个博客网站，这不 vue3 的文档改用 vitepress 搭建的，看着挺好看的，就想着也来折腾折腾搭建一个工作的文档网站。 homepage 主页设置 vuepress 或者网上 vitepress 的一些教程都写的设置 home: true，就可以设置成主页，试了好久没效果，最后看文档人家的是要设置 layout: home 才行，一试文档诚不骗我，perfect！ 这一点 vitepress 官方文档里的版本迁移 Migration from VitePress 0.x 里其实已经有说明。 ./.vitepress/dist。
73210编辑于 2023-11-18 - 来自专栏小鑫同学编程历险记
搞一搞明白Vitepress的文档渲染基础
Vitepress的文档渲染目的就是将程序员日常所写的Markdown文件编译为Html文件，并添加了更多的插件来丰富MD文件的功能，就比如说Vuejs组件在MD文件中渲染等等，为了我们可以在使用Vitepress 的时候可以更随心所欲的定制一些功能，我们要先搞一搞明白Vitepress是如何将MD文档渲染成HTML的~ 看完可以明白这3点？ MD文档转HTML文档流程； 如何支持代码块高亮； 如何实现自定义容器； 图片 演示地址 2. 实现MD文档转HTML文档 2.1 请按如下项目结构准备我们的实验环境~ ├─markdown-it-demo │ ├─src │ │ ├─index.ts │ │ ├─temp.md │ 总结 通过使用markdown-it、highlight.js、markdown-it-container模块实现了Markdown到HTML的文档转换，代码块高亮和自定义容器，VItepress搭建的组件库文档中的组件渲染和源码展示功能就需要用到自定义容器的解析和组装自定义的
1.8K30编辑于 2022-12-26 前端文档自动化：用 VitePress 搭建团队技术文档（含自动部署）
前端文档自动化：用 VitePress 搭建团队技术文档（含自动部署） 背景与目标 团队文档需要可维护、可搜索、可协作并且可自动部署。 VitePress 以 Vite 为底座、支持 Vue 组件与现代 Markdown 扩展，适合构建前端团队的工程化文档体系。 } from 'vitepress' export default defineConfig({ title: 'Team Docs', description: '前端团队技术文档', 权限与发布：主干受保护，文档改动走 PR；为文档库单独设置 CODEOWNERS。 总结 VitePress 能让团队以现代文档工作流协同：以 Markdown 为中心、可扩展的 Vue 组件、内建搜索与高性能构建。
41810编辑于 2025-12-15- 来自专栏编程技巧
简单使用vitepress快速搭建一个文档网站
VitePress 附带一个专为技术文档设计的默认主题。 你现在正在阅读的这个页面以及 Vite、Rollup、Pinia、VueUse、Vitest、D3、UnoCSS、Iconify 等文档都是基于这个主题的。 具体的内容可以参考vitepress官方文档。 具体的配置可以参考github的文档。这里只是简单描述下大概流程。绑定域名。 开发插件支持更多的文档属性，兼容hexo。关于作者来自全栈程序员nine的探索与实践，持续迭代中。
89610编辑于 2024-09-29 - 来自专栏前端开疆扩土之路
十分钟用vitepress搭建项目文档
搭建了一个项目文档，方便大家查阅。 文档地址：yinzhuo19970516.github.io/ 现在，我准备花10min介绍一下,介绍一下这个vuepress的小兄弟，vitepress vitepress是什么 vitepress 是一款基于vite vue3的静态站点生成器 有什么问题看文档吧，推荐看英文文档，中文文档不全 遇到问题建议去github gitee 搜索，目前这类的博客比较少 英文文档 中文文档 vitepress ，后续会在上面主要更新我的项目文档，有兴趣可以一起讨论，一起学习。 仓库地址 文档地址
1.5K31编辑于 2022-09-21 Vitepress网站搭建教程
Vitepress网站搭建教程准备准备一台服务器用于网站上线 本地电脑安装pnpm本地电脑安装VSCode或webstorm安装安装vitepress官网地址：https://vitepress.dev /创建项目首先在桌面新建文件夹，打开cmd窗口，输入命令回车pnpm add -D vitepress初始化在文件夹cmd窗口输入命令，开始初始化vitepresspnpm vitepress init 以下是这些目录的含义.├─ docs # 项目根目录│ ├─ .vitepress│ │ ├─ theme│ │ │ └─ index.js # 主题入口│ │ └─ config.js # 配置文件│ └─ index.md # 主页相关└─ package.json 启动在cmd里面输入下面命令就可以运行vitepress #跳转到外部链接---主页下面部分主页的这些部分都是可以更改的 里面的icon图标都是可以自定义，替换成表情或者图片，vitepress默认是没有icon的，所以你需要手动添加或直接复制我下面的代码
2K10编辑于 2024-04-13- 来自专栏软件工具
vitepress这或许是开源系统中，最好用的开源文档工具了吧
2、想搭建一个wiki网站，用来分享自己的产品介绍文档、开发接口等内容。在这样的需求驱动下，你可能会在网上搜索各种开源工具。 关于文档系统，我之前也分享过几篇，感兴趣的同学可以了解一下。 1、2分钟带你 搭建一个开源的轻量级笔记服务应用2、开源MrDoc，一个适合个人和小型团队的文档、知识、笔记在线管理系统3、WordPress最受欢迎的主题模板经过反复的折腾了N次，最终发现一款宝藏级别的文档工具 ，也是非常多的开源产品、博客系统在使用的一个开源文档工具。 这就是大名鼎鼎的Vue.js作者开发的VitePress。VitePress 是一个静态站点生成器 (SSG)，专为构建快速、以内容为中心的站点而设计。
71300编辑于 2024-08-01 - 来自专栏前端lucio
“注释”生成“VitePress文档网站”只需要“一行命令”！来试试！
jsdoc2vitepress github 需求 你可能用过jsdoc，用代码里面的注释生成文档。但是苦于jsdoc生成的文档网页太不好看，目录结构不好调整。 你可能也用过VuePress或者VitePress。但是苦于手写Markdown文档，太费时间。 那有没有一种方案，可以直接用代码注释，生成vitepress构建的文档网页呢？ 为什么不行？ 实现 初始化VitePress文档目录 期望的效果是： jsdoc2vitepress init 初始化出下面的VitePress文档目录 . ├─ docs │ ├─ .vitepress │ │ 站点 有了Markdown文档，我们接下来就是简单的运行Vitepress框架，生成Vitepress文档站点了。 (); }); program.parse(); 最终效果 初始化文档，运行文档网站 jsdoc2vitepress init jsdoc2vitepress start 控制台输出 文档网站
1.6K20编辑于 2023-04-22 - 来自专栏终身学习者
我问导师，Vue3有没有对应工具来生成漂亮的文档？ 用 Vitepress
首页 专栏 javascript 文章详情 3 我问导师，Vue3有没有对应工具来生成漂亮的文档？ 用 Vitepress ? 上已经收录，文章的已分类，也整理了很多我的文档，和教程资料。 ? 最近有人在问：小智， Vue3 有没有对应制作文档的工具。 今天，我们来一起看看，如何使用 Vitepress 快速为Vue应用创建文档。 下面是我们最后要完成的内容： ? 在开始之前，我们先来看看 Vitepress 是个啥东西。 对于大多数项目，例如文档和简单站点，Vitepress的特殊性和简约性将使开发变得轻而易举。 创建 Vitepress 项目 首先，创建目录。 代码块 在编写好的文档时，代码示例至关重要。 Vitepress 提供了一种快速添加代码块并指定正在使用的编程语言的方法。 ? ?
2.2K20发布于 2021-04-09 - 来自专栏vitepress
VitePress 强大的静态网站生成器
什么是VitePress？VitePress 是一个静态站点生成器 (SSG)，专为构建快速、以内容为中心的网站而设计。 VitePress中文教程：https://vitepress.qzxdp.cn/用例文档 VitePress附带了一个默认主题，专为技术文档而设计，特别适用于需要嵌入交互式演示的文档。 它支持您当前正在阅读的页面，以及其他文档，例如：Vite: 下一代前端工具Pinia: Vue.js的直观状态管理工具VueUse: Vue组合工具集合D3: 用于定制数据可视化的JavaScript库 Vue.js官方文档也是基于VitePress构建的，但使用了一个自定义主题，用于多语言版本之间的共享。 特别是在处理代码块方面，VitePress提供了许多高级功能，使其非常适合编写高度技术性的文档。
1.7K20编辑于 2023-07-19 - 来自专栏front-end technology
vitePress快速搭建及部署一个博客
什么是 VitePress？ VitePress 是 VuePress 的小弟弟，但是vitepress是在 Vite 上构建的。 动机 主要是因为太慢！ VitePress目标是缩减掉当前 VuePress 的复杂性并从其极简主义的根源重新开始 2.VitePress 是面向未来的：其目标浏览器是只支持原生 ES 模块导入的浏览器。 { "scripts": { "docs:dev": "vitepress dev docs", "docs:build": "vitepress build docs", md.use(require('markdown-it-xxx')) } } } 部署 以下内容有这些共同约定： 你的文档放着项目根目录的 docs 目录 使用默认的打包输出位置 (.vitepress "docs:serve": "vitepress serve docs" } } 构建文档 yarn docs:build # 将构建并存放结果到 `.vitepress/dist` yarn docs
3.9K40编辑于 2022-03-07 - 来自专栏农民工前端
尤雨溪宣布 VitePress 1.0 正式发布：基于 Vite 的静态网站生成器迎来第一个主版本
VitePress 是一个基于 Vite 的静态网站生成器，专注于构建快速、简洁的文档网站。 它利用 Vite 的构建性能优势，提供了优化的开发体验和高效的静态页面生成，适用于技术文档、博客等内容的展示。 使用场景 VitePress 主要适用于以下几种场景： 技术文档 VitePress 附带了一个专为技术文档设计的默认主题。 许多知名文档网站，如 Vite、Rollup、Pinia 和 Vue.js 官方文档，都使用了这个主题。Vue.js 官方文档在 VitePress 的基础上进行了定制，以支持不同语言之间的切换。 内置 Markdown 扩展：包括 frontmatter、表格和语法高亮等，使其成为技术文档的理想选择。
69210编辑于 2024-09-13 - 来自专栏其它
尤雨溪宣布推出 VitePress 1.0
前言尤雨溪宣布正式发布 VitePress 1.0 版本，并声称其 “基于 Vite 和 Vue 构建，是 VuePress 的精神继承者和现代替代品。” VitePress 是一个静态站点生成器 (SSG)，专为构建快速、以内容为中心的站点而设计。 简而言之，VitePress 获取用 Markdown 编写的内容，对其应用主题，并生成可以轻松部署到任何地方的静态 HTML 页面。 主题和支持VitePress 附带一个用于技术文档的默认主题，为 Vite、Rollup、Pinia、VueUse、Vitest、D3、UnoCSS、Iconify 等提供支持。 且 Vue.js 官方文档也是基于 VitePress 的。但是为了可以在不同的翻译文档之间切换，它自定义了自己的主题。
56520编辑于 2024-03-25 - 来自专栏前端框架
尤雨溪安利的这个插件，你一定要知道
前言 今天给大家介绍一个非常实用的 VitePress 插件 —— vitepress-plugin-llms，它可以帮你自动生成 LLM（大语言模型）友好的文档格式，非常适合想让 AI 更好理解你文档内容的场景 vitepress-plugin-llms 就是为这个目标而生的，它能自动为你生成 .txt 格式的 LLM 友好文档，大大提升你的 VitePress 项目的 AI 可解析性。 快速安装 使用 pnpm 安装： pnpm install vitepress-plugin-llms --save-dev 基本用法 在你的 .vitepress/config.ts 中引入并配置插件 更可控 生成的文档结构大致如下： .vitepress/dist ├── llms-full.txt // 所有文档整合为一个文件 ├── llms.txt 最后 vitepress-plugin-llms 是一个非常实用的小工具，它让你的文档站点更容易被 AI 消化，适合个人项目、开源文档站、开发者博客等场景!
66010编辑于 2025-05-05 如何在 VitePress 站点中集成 Gitalk 评论插件及其关键注意事项
前言VitePress 是一个静态站点生成器 (SSG)，非常适合用于个人博客或编写技术文档，深受很多开发者的喜爱。不过它缺少一个重要的功能——评论。 2、在 .vitepress 目录下创建 theme/MyLayout.vue 文件，添加以下内容，在每个文档末尾引入评论组件，以扩展默认主题：<template> <Layout> <template initGitalk(); }); } );});</script> 其中 <template #doc-after>自定义内容</template> 的作用是在文档结尾处插入自定义内容 查阅 Gitalk 的说明文档后，我了解了具体原因。首先，createIssueManually 是创建 Gitalk 实例时的一个可选属性。 最关键的部分在于如何优雅地将评论组件引入文档中（使用扩展默认的 VitePress 主题的方式），以及设置有效的 ID 属性值。
76040编辑于 2024-09-26- 来自专栏人生编码
使用 vitepress + docker + oneDrive 等实现本地知识库 预览+备份
1.简介使用 语雀、notion 等文档知识库，在使用起来比较方便，但是如果需要本地备份，就需要借助一些工具。 import { defineConfig } from "vitepress";_// https://vitepress.dev/reference/site-config_export default defineConfig({ title: "本地文档", description: "本地文档知识库", srcDir: ". _# 运行后的容器信息_dockerContaimerName=L\_local\_wiki_# 端口_dockerHostPort=10050dockerContainerPort=10050_# 文档目录映射配置 _dockerContaimerName=vitepress\_local\_wiki_# 端口_dockerHostPort=10050dockerContainerPort=10050_# 文档目录映射配置
69910编辑于 2023-12-04 - 来自专栏前端lucio
基于目录为VitePress生成侧边栏
---- 今天封装了一个用于自动生成VitePress 侧边栏的npm包，分享一下，求求帮忙Star。 github vitepress-plugin-autobar 这应该是目前最简洁好用的生成VitePress 侧边栏的工具了。 VitePress VitePress 是基于 Vite构建的文档网站框架，是 VuePress 的升级版本。 Vue3的文档就是用VitePress搭建的。 安装 npm install -D vitepress-plugin-autobar 使用 import { getSideBar } from 'vitepress-plugin-autobar' 添加rollup打包配置 添加Jest测试（Quality） 补充文档（Quality） npm包发布 后面带Quality的流程，都是影响npm质量评分的项目，不要偷懒不做。
1.7K10编辑于 2023-04-22
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号